<template>
  <view class="untreated">
    <view
      v-for="(i, k) in dataList"
      :key="k"
      class="untreated-item"
      @click="handleTask(i)"
    >
      <uv-icon
        :name="i.icon"
        color="#4EA770"
        size="56rpx"
        :label="i.title"
        label-color="#212121"
        label-size="28rpx"
      />
      <uv-icon
        name="arrow-right"
        color="#757575"
        size="24rpx"
        :label="i.value == 0 ? '' : i.value"
        label-color="#757575"
        label-pos="left"
        label-size="28rpx"
      />
    </view>
  </view>
</template>
<script setup>
import { onMounted, watch, ref, onBeforeUnmount } from "vue";
import { getStatistics } from "@/request/home";

const props = defineProps({
  // 是否下拉刷新
  refresh: {
    type: Boolean,
    default: false,
  },
  // 审批人
  approver: {
    type: String,
    default: "",
  },
});

const emit = defineEmits(["onRefresh", "count"]);

const dataList = ref([]); // 数据列表

onMounted(() => {
  getColumn();
  uni.$on("untreated", () => {
    getList();
  });
});

onBeforeUnmount(() => {
  uni.$off("untreated");
});

watch(
  props,
  (v) => {
    if (v.refresh) {
      setTimeout(() => {
        getList();
      }, 0);
    }
  },
  { immediate: true, deep: true }
);

// 获取列表
const getColumn = () => {
  let list = [];
  list.push({
    title: "待处理任务",
    icon: "/static/icon_pend_task.png",
    value: 0,
    path: "/pages/Home/untreatedTask",
  });
  list.push({
    title: "待处理工单",
    icon: "/static/icon_pend_order.png",
    value: 0,
    path: "/pages/Order/index",
  });
  if (props.approver == "1") {
    list.push({
      title: "待审批报告",
      icon: "/static/icon_examine.png",
      value: 0,
      path: "/pages/Home/examReport",
    });
  }
  dataList.value = list;
  getList();
};

// 获取待办任务数量
const getList = () => {
  getStatistics()
    .then((res) => {
      dataList.value[0].value = res.data.taskNum;
      dataList.value[1].value = res.data.handleWorkOrderNum;
      if (props.approver == "1") {
        dataList.value[2].value = res.data.reportNum;
      }

      let count = 0;
      dataList.value.forEach((i) => {
        count += i.value;
      });
      emit("count", { count, label: "待办事项" });
    })
    .finally(() => {
      emit("onRefresh", false);
      uni.stopPullDownRefresh();
    });
};

// 查看待办任务
const handleTask = (item) => {
  uni.navigateTo({
    url: item.path,
  });
};
</script>
<style lang="scss" scoped>
.untreated {
  width: auto;
  margin: 30rpx 40rpx;
  background-color: #ffffff;
  box-shadow: 0 0 20rpx 2rpx rgba(117, 117, 117, 0.16);
  border-radius: 20rpx;

  .untreated-item {
    height: 120rpx;
    display: flex;
    box-sizing: border-box;
    padding: 32rpx;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2rpx solid #f1f1f1;

    &:active {
      background-color: rgba(241, 241, 241, 0.36);
    }

    &:last-child {
      border-bottom: none;
    }
  }
}
</style>
